@import "../product-job/product-job.component.scss";
.da-list-wrap{
  zoom: 80%;
}
.da-content-wrapper {
  padding: 16px;
  box-shadow: none;
  height: 0;
  overflow: auto;
  .content {
    display: flex;
    flex-direction: row !important;
    width: 100%;
    height: 100%;
    align-items: stretch;
    .container-left {
      display: flex;
      flex-grow: 1;
      flex-direction: column;
      .container-left-header {
        display: flex;
        flex-direction: row;
        width: 100%;

        .container-left-header-item {
          width: 25%;
          padding: 0 10px;
          min-width: 260px;
          .container-left-header-card {
            display: flex;
            flex-direction: column;
            padding: 20px;
            background-color: #fff;
            border-radius: 15px;
            width: 100%;
            height: 100%;
            .container-left-header-card-info {
              display: flex;
              flex-direction: row;

              .info-img {
                width: 50px;
                display: flex;
                align-items: center;
              }
              .info-img1 {
                width: 50px;
                display: flex;
                align-items: center;
              }

              .info-text {
                display: flex;
                flex-direction: column;
                margin-left: 10px;

                .info-text-title {
                  font-size: 20px;
                }

                .info-text-amount {
                  font-size: 16px;
                  color: #999;
                  margin-top: 5px;
                }
              }
            }

            .container-left-header-card-amount {
              font-size: 30px;
              font-weight: 700;
              color: #333;
              margin-top: 10px;
            }
          }
        }
      }

      .container-left-tatal {
        display: flex;
        flex-direction: row;
        width: 100%;

        .tatal-left {
          width: 50%;
          padding: 10px;

          .tatal-left-text {
            display: flex;
            justify-content: space-between;
            background-color: #1296db;
            padding: 20px;
            font-size: 16px;
            border-radius: 15px;
            color: #fff;
          }
          .tatal-left-mindle {
            display: flex;
            justify-content: space-between;
            background-color: #9076f8;
            padding: 20px;
            font-size: 16px;
            border-radius: 15px;
            color: #fff;
          }
        }

        .tatal-right {
          width: 50%;
          padding: 10px;

          .tatal-right-text {
            display: flex;
            justify-content: space-between;
            background-color: #7dd2bc;
            padding: 20px;
            font-size: 16px;
            border-radius: 15px;
            color: #fff;
          }
        }
      }

      .container-left-banner {
        padding: 10px;

        .banner-body {
          background-color: #fff;
          border-radius: 15px;

          .title {
            font-size: calc($devui-font-size-price + 2px);
            font-weight: 600;
            color: #333;
            padding: 10px;
          }

          .body {
            display: flex;
            flex-direction: row;
            flex-wrap: wrap;
            justify-content: space-between;
            padding: 10px;
            align-items: center;

            .body-item {
              display: inline-block;
              vertical-align: top;
              padding: 10px;

              .body-img {
                width: 85px;
              }

              .body-item-img {
                width: 70px;
              }

              .body-item-title {
                font-size: 14px;
                color: #333;
                padding: 0 8px;
              }

              .body-item-content {
                font-size: 14px;
                color: #666;
                padding: 0 8px;
              }
            }
          }
        }

      }

      .container-left-footer {
        flex-grow: 1;
        min-height: 318px;
        .footer-content {
          background-color: #fff;
          border-radius: 15px;
          height: 100%;
          display: flex;
          flex-direction: column;

          .title {
            font-size: calc(var(--devui-font-size-price, 20px) + 2px);
            font-weight: 600;
            color: #333;
            padding: 10px;
            flex-shrink: 0;

          }

          .content {
            flex-grow: 1;
            overflow: hidden;
          }
        }

        padding:  10px 10px 0 10px;
      }
    }
    .container-right {
      display: flex;
      flex-direction: column;
      width: 20%;
      min-width: 380px;
      .container-right-header {
        display: flex;
        flex-direction: column;
        padding: 10px;
        border-radius: 15px;
        width: 100%;

        .container-right-header-title {
          font-size: calc($devui-font-size-price + 2px);
          font-weight: 600;
          color: #333;
        }
        .container-right-header-content {
          display: flex;
          flex-direction: row;
          flex-wrap: wrap;
          width: 100%;
          padding: 5px;

          .container-right-header-content-item {
            display: inline-block;
            vertical-align: top;
            padding: 10px;
            text-align: center;
            width: calc(33%);
            cursor: pointer;
            .icon {
              width: 70px;
              height: 70px;
              padding: 0px;
            }
            .icon-baojia {
              border-radius: 15px;
            }
            .icon-title {
              padding: 3px;
              font-size: 15px;
              font-weight: 700;
            }
          }
        }
      }
      .container-right-body {
        box-sizing: border-box;
        padding: 10px;
        border-radius: 15px;
        display: flex;
        height: 100%;
        flex-direction: column;
        .container-right-body-title {
          font-size: calc(var(--devui-font-size-price, 20px) + 2px);
          font-weight: 600;
          color: #333;
        }
        .container-right-body-content {
          flex-grow: 1;
          overflow: hidden;
        }
      }

      .container-right-foot {
        box-sizing: border-box;
        padding: 10px;
        border-radius: 15px;
        height: 100%;
        display: flex;
        flex-direction: column;
        .container-right-foot-title {
          font-size: calc(var(--devui-font-size-price, 20px) + 2px);
          font-weight: 600;
          color: #333;
        }
        .container-right-foot-content {
          height: 300px;
          overflow: hidden;
        }
      }
    }
  }
}
:host::ng-deep .devui-nav-container {
  font-size: $devui-font-size-modal-title !important;

  span {
    color: #333 !important;
    font-weight: 600 !important;
  }

}
.p-15{
  padding-top: 15px!important;
  flex: 1;
  min-height: 245px;
}
